<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人主页</title>
    <link rel="shortcut icon" href="img/logo.ico" type="image/x-icon">
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_list.css">
    <script src="js/jquery.min.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="nav">
        <img src="img/logo.jpeg" alt="">
        <span class="title">我的博客系统</span>
        <!-- 用来占据中间位置 -->
        <span class="spacer"></span>
        <a href="index.html">首页</a>
        <a href="blog_add.html">写博客</a>  
        <a href="javascript: logout();">注销</a>
    </div>
    <!-- 版心 -->
    <div class="container">
        <!-- 左侧个人信息 -->
        <div class="container-left">
            <div class="card">
                <img src="img/default.png" class="avtar" alt="">
                <!-- <div class="over-avatar" id="git-avatar-settings">更换头像</div> -->
                <h3 id="nickname"></h3>
                <a href="http://www.github.com">github 地址</a>
                <div class="counter">
                    <span>文章数</span>
                </div>
                <div class="counter">
                    <span id="account"></span>
                </div>
            </div>
        </div>
        <!-- 右侧内容详情 -->
        <div id="artlist" class="container-right">
            <div id="unart" style="text-align:center; display:none; color: grey; padding: 50px 0;">
                <span>当前用户未发表文章</span>
            </div>
            <!-- 每一篇博客包含标题, 摘要, 时间 -->
            <!-- <div class="blog">
                <div class="title">xxx</div>
                <div class="date">xxx</div>
                <div class="desc">xxx</div>
                <a href="blog_content.html?id=x" class="detail">查看全文 &gt;&gt;</a>
                <div class="detail3">
                    <a href="blog_edit.html?id=x" class="detail2">编辑</a>&nbsp;&nbsp;
                    <a href="javaScript:del();" class="detail2">删除</a>
                </div>
            </div> -->
        </div>
    </div>

    <script>
        var uid = 0;
        // 1.查询用户信息
        function myUserInfo() {
            jQuery.ajax({
                url: "loginuserinfo",
                type: "GET",
                success: function (data) {
                    if (data != null && data.success == 200) {
                        // 前后端交互正常
                        if (data.data != null && data.data.uid > 0) {
                            // 登录正常
                            jQuery("#nickname").text(data.data.nickname);
                            uid = data.data.uid;
                            // 查询用户的文章
                            createArtList();
                        } else {
                            alert("请先登录！");
                            location.href = "login.html";
                        }
                    } else {
                        alert("服务器繁忙！");
                    }
                }
            });
        }
        myUserInfo();

        // 2.得到用户的文章列表
        function createArtList() {
            jQuery.ajax({
                url: "myartlist",
                type: "Get",
                success: function (data) {
                    if (data != null && data.success == 200) {
                        // 交互正常
                        var artlist = data.data;
                        if (artlist != null && artlist.length > 0) {
                            jQuery("#account").text(artlist.length);
                            // 当前用户有发表文章
                            var artHtml = "";
                            for (var i = 0; i < artlist.length; i++) {
                                var article = artlist[i];
                                artHtml += '<div class="blog"><div class="title">' +
                                    article.title + '</div><div class="date">' +
                                    article.create_time + '</div><div class="desc">' +
                                    article.desc + '</div><a href="blog_content.html?id=' +
                                    article.aid + '" class="detail">查看全文 &gt;&gt;</a><div class="detail3"><a href="blog_edit.html?id=' +
                                    article.aid + '" class="detail2">编辑</a>&nbsp;&nbsp;<a href="javaScript:del(' +
                                    article.aid + ');" class="detail2">删除</a></div></div>'
                            }
                            jQuery("#artlist").html(artHtml);
                        } else {
                            // 未发表文章
                            jQuery("#unart").show();
                            jQuery("#account").text(0);
                        }
                    } else {
                        alert("服务器繁忙！")
                    }
                }
            });
        }

        // 注销
        function logout() {
            if (confirm("确认注销？")) {
                // session 清空
                jQuery.ajax({
                    url: "logout",
                    type: "POST",
                    success: function (data) {
                        if (data != null && data.success == 200 && data.data == 1) {
                            // 注销成功
                            location.href = "login.html";
                        } else {
                            alert("注销失败！");
                        }
                    }
                });
            }
        }

        // 删除文章
        function del(aid) {
            if (confirm("确认删除？")) {
                if (aid != null && aid > 0) {
                    jQuery.ajax({
                        url: "delart",
                        type: "POST",
                        data: {
                            "aid": aid,
                            "uid": uid
                        },
                        success: function (data) {
                            if (data != null && data.success == 200 && data.data == 1) {
                                alert("删除成功！");
                                location.href = location.href;
                            } else {
                                alert("删除失败！");
                            }
                        }
                    });
                }
            }
        }
    </script>
</body>

</html>